<template>
    <div class="cognizance">
        <!-- 认定结果 -->
        <nav>
            <img src="../../assets/img/long-range.png" alt="">
        </nav>
        <section>
            <p class="cog-title">{{title}}</p>
            <p>等待定责结果</p>
            <p v-show="timeFlag">{{time}}</p>
        </section>
        <footer>
            <p>若未能收到认定结果，请拨打110请求警方协助</p>
            <div class="btnSec">
                <mu-button @click="seeResuilt" class="submit" color="#6794F5" :disabled="btnState" full-width>查看认定结果</mu-button>
            </div>
        </footer>
    </div>
</template>

<script>
import {http} from 'utils/request.js';
import api from '../../api/index.js';
export default {
    name: "cognizance",
    data() {
        return {
            time: 10,
            btnState: true,
            timeFlag: false,
            title:""
        }
    },
    created() {
        const state = this.$route.query.isAllAgree;
        if(state) {
            this.title = "交警责任复核中"
            document.title = "责任复核";
            this.timeFlag = true;
            this.startTimer();
        }else {
            this.title = "交警远程定责中";
            document.title = "远程定责";
        }
    },
    mounted() {
        
    },
    methods: {
        startTimer() {
            const timer = setInterval(()=>{
                this.time--;
                if(this.time==0) {
                    this.btnState = false;
                    clearInterval(timer);
                }
            },1000);
        },
        seeResuilt() {
            const accidentNo = this.$route.query.accidentNo;
            http.post(api.API_ACCIDENT_DETAIL, {
                accidentNo: accidentNo
            }).then(res => {
                if (res.code == "1") {
                    //生成pdf后可跳转 6
                    const accidentInfo = res.resultObj.accidentInfoBean;
                    if(accidentInfo.accidentStatus=="6") {
                        this.$router.push({
                            name:"responsibility",
                            query:{
                                accidentNo:accidentNo
                            }
                        });
                    }else {
                        this.$toast.message({
                            message: '正在生成责任认定书，请稍后再试！',
                            color: '#F57979'
                        });
                    }
                }
            }).catch(error => {
                console.log(error);
            });
        },
        //判断是否
    },
}
</script>

<style lang="scss" scoped>
@import "~assets/css/mixin.scss";
.cognizance {
    width: 100%;
    height: 100%;
    overflow: hidden;
    nav {
        img {
            display: block;
            width: rem(150);
            height: rem(150);
            margin: rem(28) auto rem(20);
        }
    }
    section {
        text-align: center;
        p:first-child {
            font-size: rem(20);
            color: #555555;
            margin-bottom: rem(15);
        }
        p:nth-child(2) {
            font-size: rem(16);
            color: #8D9093;
        }
        p:last-child {
            font-size: rem(16);
            color: #678CDF;
            margin-top: rem(8);
        }
    }
    footer {
        position: absolute;
        bottom: rem(20);
        right: 0;
        left: 0;
        p {
            text-align: center;
            color: #8D9093;
            font-size: rem(12);

        }
        .submit {
            display: block;
            width: 3.45rem;
            height: 0.48rem;
            margin: 0.2rem auto;
            font-size: 0.18rem;
        }
    }
}
</style>
